<template>
	<div>
		<el-table :data="list" :header-cell-style="{ 'text-align': 'center' }" :cell-style="{ 'text-align': 'center' }"
			class="w-full max-h-80" style="overflow: auto;" height="20rem" @selection-change="handleSelectionChange">
			<el-table-column type="selection" width="55" />

			<el-table-column prop="machine_id" :label="$t('machine.code')" show-overflow-tooltip>
				<template #default="scope">
					{{ scope.row.machine_id || '--' }} ({{ scope.row.machine_name || '' }})
				</template>
			</el-table-column>

			<el-table-column prop="retail_price" :label="$t('machine.channel.priceProduct')" show-overflow-tooltip>
				<template #default="scope">
					{{ scope.row.retail_price || '--' }}
				</template>
			</el-table-column>

		</el-table>

		<div class="w-full mt-6">
			{{ $t('machine.channel.revisedPrice') }}：
			<el-input v-model="data.money" :placeholder="$t('message.pleaseEnter')" style="width: 60%;" />
		</div>

		<div class="w-full text-center mt-6">
			<div class="inline-block">
				<el-button type="primary" size="small" @click="submit">
					{{ $t('public.save') }}
				</el-button>

				<el-button size="small" @click="cancel">
					{{ $t('public.cancel') }}
				</el-button>
			</div>
		</div>

	</div>
</template>

<script lang="ts" setup>
import { useI18n } from 'vue-i18n'
const { t: $t } = useI18n()
let emit = defineEmits(['edit']);
let props = defineProps({
	list: {
		// 商品信息
		type: Array,
		default: []
	},
})

let data = reactive({
	money: '', // 价格
	macid: [], // 选中的设备Id
	morebygid: { // 修改设备商品信息
		where: {},
		update: {}
	}
})

// 选中的商品
let handleSelectionChange = (e) => {
	data.macid = []
	for (let item of e) {
		data.macid.push(item.m_id)
	}
}

let submit = () => {
	if (data.macid.length == 0) {
		ElMessage({
			message: $t('message.pleaseSelectMachine'),
			type: 'error'
		})
		return
	}

	if (data.money == '') {
		ElMessage({
			message: $t('message.pleasePrice'),
			type: 'error'
		})
		return
	}

	data.morebygid.where = {
		g_id: props.list[0].g_id,
		m_id: data.macid.join(',')
	}

	data.morebygid.update = {
		retail_price: data.money
	}

	emit('edit', data.morebygid)
}

let cancel = () => {
	emit('edit', false)
}

</script>
